<template>
	<view>
		<!--<z-nav-bar>完善个人资料</z-nav-bar>
		<public-module></public-module>-->
		<view class="QS-tabs-box">
			<QSTabs 
			ref="tabs" 
			:tabs="tabs" 
			animationMode="line3" 
			:current="current" 
			@change="change"
			activeColor="#000"
			lineColor="#81B435"
			swiperWidth="750">
			</QSTabs>
		</view>
		<swiper
		:style="{'height': '100vh'}" 
		:current="swiperCurrent" 
		@transition="transition"
		@animationfinish="animationfinish">
			<swiper-item>
				<scroll-view scroll-y style="height: 100%;width: 100%;background: #f7f8fa;padding: 16px;">
					<view class="scroll-items">
						<uni-forms :modelValue="studentInfo" ref="preForm" :value="studentInfo" :rules="preRules">
							<!-- 基本信息 -->
							<view class="swiper">
								<view class="forms">
									<view class="title-bar">基本信息</view>
									<uni-forms-item label="姓名" name="studentName" required>
										<uni-easyinput type="text" v-model="studentInfo.studentName" placeholder="请输入" />
									</uni-forms-item>
									<uni-forms-item label="手机" name="cellNo" required>
										<uni-easyinput type="text" v-model="studentInfo.cellNo" placeholder="请输入" />
									</uni-forms-item>
									<uni-forms-item label="QQ" name="qqNo" required>
										<uni-easyinput type="text" v-model="studentInfo.qqNo" placeholder="请输入" />
									</uni-forms-item>
								</view>
							</view>
						
							<!-- 学籍信息 -->
							<view class="swiper">
								<view class="forms">
									<view class="title-bar">学籍信息</view>
									<uni-forms-item label="在读院校" name="schoolId" required>
										<vvSelect v-model="studentInfo.schoolId" @change="getPreCollegeOptions" placeholder="请选择" :list="preSchoolOptions" valueKey="schoolId"
											label="schoolName"></vvSelect>
									</uni-forms-item>
									<uni-forms-item label="在读院系" name="collegeId" required>
										<vvSelect ref="preCollegeId" v-model="studentInfo.collegeId" @change="getPreMajorOptions" placeholder="请选择" :list="preCollegeOptions" valueKey="collegeId"
											label="collegeName"></vvSelect>
									</uni-forms-item>
									<uni-forms-item label="在读专业" name="majorId" required>
										<vvSelect ref="preMajorId" v-model="studentInfo.majorId" placeholder="请选择" :list="preMajorOptions" valueKey="majorId"
											label="majorName"></vvSelect>
									</uni-forms-item>
									<uni-forms-item label="年级" name="grade" required>
										<vvSelect v-model="studentInfo.grade" placeholder="请选择" :list="classYearOptions" 
											valueKey="dictValue" label="dictLabel"></vvSelect>
									</uni-forms-item>
									<!--
									<uni-forms-item label="生源类型" name="marketingSource">
										<vvSelect v-model="eduStudent.studentInfo.marketingSource" placeholder="请选择" :list="categorys"
											valueKey="value" label="label"></vvSelect>
									</uni-forms-item>
									-->
								</view>
							</view>
						</uni-forms>
						<button type="primary" class="btn" form-type="submit" @click="submitPreForm">预报名</button>
					</view>
				</scroll-view>
			</swiper-item>
			<swiper-item class="swiper-item">
				<scroll-view scroll-y style="height: 100%;width: 100%;background: #f7f8fa;padding: 16px;">
					<view class="scroll-items">
						<uni-forms :modelValue="studentInfoZs" ref="form" :value="studentInfoZs" :rules="rules">
							<!-- 基本信息 -->
							<view class="swiper">
								<view class="forms">
									<view class="title-bar">基本信息</view>
									<uni-forms-item label="姓名" name="studentName" required>
										<uni-easyinput type="text" v-model="studentInfoZs.studentName" placeholder="请输入" />
									</uni-forms-item>
									<uni-forms-item label="性别" name="sex" required>
										<radio-group class="radio-group" @change="radioChange">
											<label v-for="(item, index) in sexRadio" :key="item.dictValue">
												<radio :value="item.dictValue" :checked="item.dictValue === studentInfoZs.sex" style="transform:scale(0.7)" />
												<text>{{item.dictLabel}}</text>
											</label>
										</radio-group>
									</uni-forms-item>
									<uni-forms-item label="手机" name="cellNo" required>
										<uni-easyinput type="text" v-model="studentInfoZs.cellNo" placeholder="请输入" />
									</uni-forms-item>
									<uni-forms-item label="QQ" name="qqNo" required>
										<uni-easyinput type="text" v-model="studentInfoZs.qqNo" placeholder="请输入" />
									</uni-forms-item>
									<uni-forms-item label="身份证" name="idNo" required>
										<uni-easyinput type="text" v-model="studentInfoZs.idNo" placeholder="请输入" />
									</uni-forms-item>
						
									<uni-forms-item label="详细地址" name="addr" required>
										<uni-easyinput type="text" v-model="studentInfoZs.addr" placeholder="请输入" />
									</uni-forms-item>
									<uni-forms-item label="民族" name="nation" required>
										<vvSelect v-model="studentInfoZs.nation" placeholder="请选择" :list="nationOptions" valueKey="dictValue"
											label="dictLabel"></vvSelect>
									</uni-forms-item>
									<uni-forms-item label="紧急联系人" name="eduStudentUrgentList" required>
										<view class="select" @click="onPageJump('eduStudentUrgentList')">{{studentInfoZs.eduStudentUrgentList === undefind ? 0 : studentInfoZs.eduStudentUrgentList.length}}
											<uni-icons type="arrowright" size="16"></uni-icons>
										</view>
									</uni-forms-item>
								</view>
							</view>
						
							<!-- 学籍信息 -->
							<view class="swiper">
								<view class="forms">
									<view class="title-bar">学籍信息</view>
									<uni-forms-item label="在读院校" name="schoolId" required>
										<vvSelect v-model="studentInfoZs.schoolId" @change="getCollegeOptions" placeholder="请选择" :list="schoolOptions" valueKey="schoolId"
											label="schoolName"></vvSelect>
									</uni-forms-item>
									<uni-forms-item label="在读院系" name="collegeId" required>
										<vvSelect ref="collegeId" v-model="studentInfoZs.collegeId" @change="getMajorOptions" placeholder="请选择" :list="collegeOptions" valueKey="collegeId"
											label="collegeName"></vvSelect>
									</uni-forms-item>
									<uni-forms-item label="在读专业" name="majorId" required>
										<vvSelect ref="majorId" v-model="studentInfoZs.majorId" placeholder="请选择" :list="majorOptions" valueKey="majorId"
											label="majorName"></vvSelect>
									</uni-forms-item>
									<uni-forms-item label="班级" name="classNo" required>
										<uni-easyinput type="text" v-model="studentInfoZs.classNo" placeholder="请输入" />
									</uni-forms-item>
									<uni-forms-item label="文理" name="subjectType" required>
										<vvSelect v-model="studentInfoZs.subjectType" placeholder="请选择" :list="subjectTypeOptions"
											valueKey="dictValue" label="dictLabel"></vvSelect>
									</uni-forms-item>
									<uni-forms-item label="年级" name="grade" required>
										<vvSelect v-model="studentInfoZs.grade" placeholder="请选择" :list="classYearOptions" 
											valueKey="dictValue" label="dictLabel"></vvSelect>
									</uni-forms-item>
									<!--
									<uni-forms-item label="生源类型" name="marketingSource">
										<vvSelect v-model="eduStudent.studentInfo.marketingSource" placeholder="请选择" :list="categorys"
											valueKey="value" label="label"></vvSelect>
									</uni-forms-item>
									-->
								</view>
							</view>
						
						
							<!-- 报名信息 -->
							<view class="swiper">
								<view class="forms">
									<view class="title-bar">报名信息</view>
									<!--
									<uni-forms-item label="学期" name="sex">
										<uni-easyinput type="text" v-model="eduStudent.studentInfo.name" placeholder="请输入" />
									</uni-forms-item>
									-->
									<uni-forms-item label="报读班型" name="modelId" required>
										<vvSelect v-model="studentInfoZs.modelId" placeholder="请选择" :list="modelOptions"
											valueKey="modelId" label="modelName"></vvSelect>
									</uni-forms-item>
									<!-- 	<uni-forms-item label="报名校区" name="cellNo">
										<uni-easyinput type="text" v-model="eduStudent.studentInfo.cellNo" placeholder="请输入" />
									</uni-forms-item>
									<uni-forms-item label="吃住情况" name="qqNo">
										<uni-easyinput type="text" v-model="eduStudent.studentInfo.qqNo" placeholder="请输入" />
									</uni-forms-item> 
									-->
									<uni-forms-item label="招生老师" name="recruitUserId" required>
										<vvSelect ref="recruitUserId" v-model="studentInfoZs.recruitUserId" placeholder="请选择" 
											:list="recruitUserOptions" valueKey="userId" label="nickName"></vvSelect>
									</uni-forms-item>
									<!--
									 	<uni-forms-item label="赠送课程" name="addr">
										<uni-easyinput type="text" v-model="eduStudent.studentInfo.addr" placeholder="请输入" />
									</uni-forms-item> -->
								</view>
							</view>
						</uni-forms>
						<button type="primary" class="btn" form-type="submit" @click="submitForm">提交报名</button>
					</view>
				</scroll-view>
			</swiper-item>
		</swiper>
		

	</view>
</template>

<script>
	import vvSelect from '@/components/vv-select/vv-select'
	import store from '@/store';
	import QSTabs from '@/components/QS-tabs/QS-tabs.vue';
	const Sys = uni.getSystemInfoSync();
	const wH = Sys.windowHeight;
	
	let phone = `function(rule, value, data, callback) {callback('手机号码格式不正确，请重新填写')return true}`
	
	export default {
		components: {
			vvSelect,
			QSTabs
		},
		data() {
			let _this = this
			return {
				tabs:['预报名','在线报名'],
				current: 0,
				swiperCurrent: 0,
				tabsHeight: 0,
				dx: 0,
				nationOptions: [], // 民族
				sexRadio: [], // 性别
				classYearOptions: [],
				subjectTypeOptions: [],
				schoolOptions: [],
				collegeOptions: [],
				majorOptions: [],
				preSchoolOptions: [],
				preCollegeOptions: [],
				preMajorOptions: [],
				modelOptions: [],
				recruitUserOptions: [],
				preEduStudent: {
					studentInfo: {
						studentName: '',
						cellNo: '',
						qqNo: '',
						schoolId: '',
						collegeId: '',
						majorId: '',
						grade: ''
					}
				},
				studentInfo: {
					studentName: '',
					cellNo: '',
					qqNo: '',
					schoolId: '',
					collegeId: '',
					majorId: '',
					grade: ''
				},
				eduStudent: {
					studentInfo: {
						studentId: '',
						studentName: '',
						sex: '',
						cellNo: '',
						qqNo: '',
						idNo: '',
						addr: '',
						eduStudentUrgentList: [/*{
							urgentName: '',
							cellNo: '',
							urgentType: ''
						}*/],
						schoolId: '',
						collegeId: '',
						majorId: '',
						classNo: '',
						subjectType: '',
						grade: '',
						grade: '',
						marketingSource: '',
						recruitUserId: '',
					},
					modelId: '',
					accountId: '',
				},
				studentInfoZs: {
					studentId: '',
					studentName: '',
					sex: '',
					cellNo: '',
					qqNo: '',
					idNo: '',
					addr: '',
					nation:  '',
					eduStudentUrgentList: [/*{
						urgentName: '',
						cellNo: '',
						urgentType: ''
					}*/],
					schoolId: '',
					collegeId: '',
					majorId: '',
					classNo: '',
					subjectType: '',
					grade: '',
					grade: '',
					marketingSource: '',
					recruitUserId: '',
					modelId: ''
				},
				tmpUrgentList: [],
				modelId: null,
				preRules: {
					'studentName': {
						rules: [{
							required: true,
							errorMessage: '请输入姓名'
						}]
					},
					cellNo: {
						rules: [
							{
								required: true,
								errorMessage: '请输入手机号'
							},
							{
								validateFunction: async function(rule, value, data, callback) {
									let iphoneReg = /^1[0-9]{10}$/
									if (!iphoneReg.test(value)) {
										callback('手机号码格式不正确，请重新填写')
									}
									let params = {
										type: '0',
										data: value
									}
									let res = await _this.$api.common.checkStudentRegist(params)
									if(res.code == 200) {
										return true
									} else {
										return new Error('当前手机号已注册，请联系管理员')
									}
								}
							},
						]
					},
					qqNo: {
						rules: [{
							required: true,
							errorMessage: '请输入QQ号'
						},{
							validateFunction:function(rule, value, data, callback) {
								let iphoneReg = /^[1-9][0-9]{4,12}$/
								if (!iphoneReg.test(value)) {
									callback('请输入正确的QQ格式')
								}
								return true
							}
						}]
					},
					schoolId: {
						rules: [{
							required: true,
							errorMessage: '请选择在读院校'
						}]
					},
					collegeId: {
						rules: [{
							required: true,
							errorMessage: '请选择在读院系'
						}]
					},
					majorId: {
						rules: [{
							required: true,
							errorMessage: '请选择在读专业'
						}]
					},
					grade: {
						rules: [{
							required: true,
							errorMessage: '请选择年级'
						}]
					}
				},
				rules: {
					'studentName': {
						rules: [{
							required: true,
							errorMessage: '请输入姓名'
						}]
					},
					sex: {
						rules: [{
							required: true,
							errorMessage: '请输入性别'
						}]
					},
					cellNo: {
						rules: [
							{
								required: true,
								errorMessage: '请输入手机号'
							},
							{
								validateFunction: async function(rule, value, data, callback) {
									let iphoneReg = /^1[0-9]{10}$/
									if (!iphoneReg.test(value)) {
										callback('手机号码格式不正确，请重新填写')
									}
									let res = await _this.$api.common.checkStudentRegist(params)
									if(res.code == 200) {
										return true
									} else {
										return new Error('当前手机号已注册，请联系管理员')
									}
								}
							},
						]
					},
					qqNo: {
						rules: [{
							required: true,
							errorMessage: '请输入QQ号'
						},{
							validateFunction:function(rule, value, data, callback) {
								let iphoneReg = /^[1-9][0-9]{4,12}$/
								if (!iphoneReg.test(value)) {
									callback('请输入正确的QQ格式')
								}
								return true
							}
						}]
					},
					idNo: {
						rules: [{
							required: true,
							errorMessage: '请输入身份证'
						},{
							validateFunction:function(rule, value, data, callback) {
								let iphoneReg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/
								if (!iphoneReg.test(value)) {
									callback('请输入正确的身份证格式')
								}
								return true
							}
						}]
					},
					addr: {
						rules: [{
							required: true,
							errorMessage: '请输入详细地址'
						}]
					},
					nation: {
						rules: [{
							required: true,
							errorMessage: '请选择名族'
						}]
					},
					eduStudentUrgentList: {
						rules: [{
							required: true,
							errorMessage: '请添加紧急联系人'
						}]
					},
					schoolId: {
						rules: [{
							required: true,
							errorMessage: '请选择在读院校'
						}]
					},
					collegeId: {
						rules: [{
							required: true,
							errorMessage: '请选择在读院系'
						}]
					},
					majorId: {
						rules: [{
							required: true,
							errorMessage: '请选择在读专业'
						}]
					},
					classNo: {
						rules: [{
							required: true,
							errorMessage: '请输入班级'
						}]
					},
					subjectType: {
						rules: [{
							required: true,
							errorMessage: '请选择文理'
						}]
					},
					grade: {
						rules: [{
							required: true,
							errorMessage: '请选择年级'
						}]
					},
					modelId: {
						rules: [{
							required: true,
							errorMessage: '请选择报读班型'
						}]
					},
					recruitUserId: {
						rules: [{
							required: true,
							errorMessage: '请选择招生老师'
						}]
					},
				}
			}
		},
		onShow() {
			this.studentInfoZs.eduStudentUrgentList = JSON.parse(JSON.stringify(this.tmpUrgentList))
		},
		onReady () {
			this.$refs.preForm.setRules(this.preRules)
			this.$refs.form.setRules(this.rules)
		},
		onLoad(option) {
			// 初始化获取edustudent已知信息
			let storeUserInfo = store.state.userInfo;
			if (!storeUserInfo.token) { // nvue页面读取不到vuex里面数据，将取缓存
				storeUserInfo = uni.getStorageInfoSync("userInfo");
			}
			//console.log( storeUserInfo );
			this.eduStudent.studentInfo.studentId = storeUserInfo.userId // 设置用户ID，否则学生表会变成新增
			
			// 判断学生是否存在已报名但未结业班型
			this.$api.regist.checkSignStatus({studentId: storeUserInfo.userId}).then(res => {
				if(res.data > 0) {
					// uni.showModal({
					// 	title: '提示',
					// 	content: '您已报名成功，请勿重复操作~',
					// 	confirmText: '知道了',
					// 	showCancel: false,
					// 	cancelColor: '#81B435',
					// 	success: (res) => {
					// 		 uni.navigateBack({
					// 		 	delta: 1
					// 		 })
					// 	}
					// });
				}
			}) .catch(err => {
				uni.showModal({
					title: '提示',
					content: '服务异常，请联系管理员老师',
					confirmText: '知道了',
					showCancel: false,
					cancelColor: '#81B435',
					success: (res) => {
						 uni.navigateBack({
						 	delta: 1
						 })
					}
				});	
			})
			
			this.$api.common.getDict("sys_user_sex").then(res => {
				this.sexRadio = res.data
			})
			this.$api.common.getDict("sys_nation").then(res => {
				this.nationOptions = res.data
			})
			this.$api.common.getDict("edu_class_year").then(res => {
				this.classYearOptions = res.data
			})
			this.$api.common.getDict("edu_subject_type").then(res => {
				this.subjectTypeOptions = res.data
			})
			this.$api.regist.getHSchools().then(res => {
				this.schoolOptions = res.data
				this.preSchoolOptions = res.data
			})
			this.$api.model.getModelList().then(res => {
				this.modelOptions = res.data
			})
			
		},
		methods: {
			change(index) {
				this.swiperCurrent = index;
			},
			transition({ detail: { dx } }) {
				this.$refs.tabs.setDx(dx);
			},
			animationfinish({detail: { current }}) {
				this.$refs.tabs.setFinishCurrent(current);
				this.swiperCurrent = current;
				this.current = current;
			},
			onPageJump(url) {
				// 加密值传递
				let data = encodeURIComponent(JSON.stringify(this.studentInfoZs.eduStudentUrgentList))
				uni.navigateTo({
					url: `/subpages/home/chooseStudentUrgent?data=${data}`
				});
			},
			radioChange(evt) {
				// for (let i = 0; i < this.sexRadio.length; i++) {
				// 	if (this.sexRadio[i].value === evt.detail.value) {
				// 		this.studentInfoZs.sex = String(i)
				// 		//console.log(this.eduStudent.studentInfo.sex)
				// 		break;
				// 	}
				// }
				this.studentInfoZs.sex = evt.detail.value
			},
			 getPreCollegeOptions(schoolId) {
				 let deptId = null
				 this.preSchoolOptions.forEach(school => {
				 	if(school.schoolId === schoolId) {
				 		deptId = school.deptId
				 		this.preCollegeOptions = school.eduHCollegesList
				 	}
				 })
				 // 学校变化时，先将招生老师清空
				 this.studentInfo.collegeId= ''
				 this.studentInfo.majorId = ''
				 this.$refs.preCollegeId.checkItemByKey('')
				 this.$refs.preMajorId.checkItemByKey('')
			 },
			 getCollegeOptions(schoolId) {
			// 不用再调这个俩接口，前面在school中已经拿到了学院、专业数据
			// 	this.$api.regist.getHColleges({schoolId: schoolId}).then(res => {
			// 		this.collegeOptions = res.data
			// 	})
				let deptId = null
				this.schoolOptions.forEach(school => {
					if(school.schoolId === schoolId) {
						deptId = school.deptId
						this.collegeOptions = school.eduHCollegesList
					}
				})
				
				// 学校变化时，先将招生老师清空
				this.eduStudent.studentInfo.recruitUserId = ''
				this.eduStudent.studentInfo.collegeId= ''
				this.eduStudent.studentInfo.majorId = ''
				this.$refs.recruitUserId.checkItemByKey('')
				this.$refs.collegeId.checkItemByKey('')
				this.$refs.majorId.checkItemByKey('')
				// 根据校区ID获取对应的招生老师
				if(deptId) {
					this.$api.regist.getRecruitUser({deptId: deptId}).then(res => {
							this.recruitUserOptions = res.data
						})
				}
			 },
			 getMajorOptions(collegeId) {
				 // 不用再调这个俩接口，前面在school中已经拿到了学院、专业数据
			// 	this.$api.regist.getHMajors({collegeId: collegeId}).then(res => {
			// 		this.collegeOptions = res.data
			// 	})
				this.collegeOptions.forEach(college => {
					if(college.collegeId === collegeId) {
						this.majorOptions = college.eduHMajorsList
					}
				})
				
			 },
			 getPreMajorOptions(collegeId) {
			 	 // 不用再调这个俩接口，前面在school中已经拿到了学院、专业数据
			 // 	this.$api.regist.getHMajors({collegeId: collegeId}).then(res => {
			 // 		this.collegeOptions = res.data
			 // 	})
			 	this.preCollegeOptions.forEach(college => {
			 		if(college.collegeId === collegeId) {
			 			this.preMajorOptions = college.eduHMajorsList
			 		}
			 	})
			 	
			  },
			submitPreForm ()  {
				this.$refs.preForm.submit().then(res => {
					//console.log('res', JSON.stringify((res)))
					if(store.state.userInfo.accountId) {
						this.preEduStudent.accountId = store.state.userInfo.accountId
						this.preEduStudent.studentInfo = this.studentInfo
					}
					this.$api.regist.preRegist(this.preEduStudent).then((res) => {
						console.log('表单返回得值：', res)
						let tipSrc = res.code === 200 ? '恭喜您，预报名成功' : '预报名失败，请联系招生老师';
						uni.showModal({
							title: '提示',
							content: tipSrc,
							confirmText: '知道了',
							showCancel: false,
							cancelColor: '#81B435',
							success: (res) => {
								uni.navigateBack({
									delta: 1
								})
							}
						})
					})
				})
			},
			submitForm() {
				// 手动提交表单
				console.log('eduStudent -- ', this.studentInfoZs)
				this.$refs.form.submit().then(res => {
					//console.log('res', JSON.stringify((res)))
					if(store.state.userInfo.accountId) {
						this.eduStudent.accountId = store.state.userInfo.accountId
						this.eduStudent.studentInfo = this.studentInfoZs
						this.eduStudent.modelId = this.studentInfoZs.modelId
					}
					this.$api.regist.registOnline(this.eduStudent).then((res) => {
						console.log('表单返回得值：', res)
						let tipSrc = res.code === 200 ? '恭喜您，在线报名成功' : '在线报名失败，请联系招生老师';
						uni.showModal({
							title: '提示',
							content: tipSrc,
							confirmText: '知道了',
							showCancel: false,
							cancelColor: '#81B435',
							success: (res) => {
								uni.navigateBack({
									delta: 1
								})
							}
						});
						// 仅作为示例，非真实参数信息。
						/*
						在线报名无需在线付费
						uni.requestPayment({
							provider: 'wxpay',
							timeStamp: String(Date.now()),
							nonceStr: 'A1B2C3D4E5',
							package: 'prepay_id=wx20180101abcdefg',
							signType: 'MD5',
							paySign: '',
							success: function(res) {
								console.log('success:' + JSON.stringify(res));
							},
							fail: function(err) {
								console.log('fail:' + JSON.stringify(err));
							}
						});
						*/
					})
				})
			},
		},

	}
</script>

<style lang="scss">
	@import '@/style/mixin.scss';

	page {
		background-color: $uni-bg-color-grey;
	}
	.QS-tabs-box{
		width: 100%;
		position: sticky;
		top: 0;
		z-index: 10;
		background-color: white;
	}
	.QS-tabs-box{
		width: 100%;
		position: sticky;
		top: 0;
		z-index: 10;
		background-color: white;
	}
	.swiper-item{
		background-color: #fff;
	}
	.scroll-items{
		display: flex;
		flex-direction: column;
		// width: 100%;
		// padding: 40rpx;
	}
	.scroll-item{
		margin-top: 15rpx;
		padding: 25rpx;
		background-color: white;
		border-radius: 8rpx;
		width: 100%;
		display: flex;
		flex-direction: row;
		border: 1px solid #f8f8f8;
	}
	.scroll-item-image-box{
		flex-grow: 0;
	}
	.scroll-item-text-box{
		flex-grow: 1;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		font-size: 28rpx;
		font-weight: bold;
		margin-left: 15rpx;
	}
	.scroll-item-image{
		border-radius: 4rpx;
		width: 180rpx;
		height: 150rpx;
	}
	.swiper {
		margin-bottom: 16px;
	}

	.forms {
		width: 686upx;
		margin: 0 auto;
		padding: 24px 16px;
		background: #FEFFFF;
		border-radius: 16px;

		/deep/ input {
			text-align: right;
			outline: none;
		}

		/deep/ .is-input-border {
			border: 0 !important;
		}

		/deep/ .uni-forms-item__label {
			width: 75px !important;
		}

		// 三级选择器
		/deep/ .vv-input__body {
			text-align: right;
			font-size: 14px;
		}

		/deep/ .vv-input__placeholder {
			color: #777;
			font-size: 14px;
		}

		.radio-group {
			text-align: right;
		}

		.title-bar {
			font-size: 17px;
			font-weight: bold;
			color: #323232;
			width: 100%;
			padding-bottom: 10px;
			border-bottom: 1px solid #F5F5F5;
		}

		.select {
			width: 100%;
			text-align: right;
			line-height: 72upx;
		}
	}

	.btn {
		background-color: $uni-theme-color;
		border-radius: 30px;
		margin-top: 36upx;
	}


	/deep/ .input-value-border {
		border: 0;
	}
	/deep/.uni-forms-item__inner, .uni-forms-item__content {
		 line-height: 36px;
	}
	/deep/.QS-tabs-scroll-item {
		width:50% !important;
	}
</style>
